<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>01_事件处理</title>
    <script src="../js/vue.js"></script>
</head>
<body>
    <div class="root">
        <h1>hello,vue</h1>
<!--        <button v-on:click="test1">点我传送到我身边(不传参)</button>-->
<!--        简写-->
        <button @click="test1">点我传送到我身边(不传参)</button>
<!--        第二个传入的参数 是为了个事件对象占位-->
        <button @click="test2(666,$event)">点我传送到我身边(传参)</button>
    </div>
    <script>
        Vue.config.productionTip = false;
        const vm = new Vue({
            el:'.root',
            methods:{
                // 注意：在vue中不能定义箭头函数 否则this会指向为windows
                /*
                * 其实也可以写在data里
                *
                * 只不过vue会很累
                *
                * 还要去解析 不建议
                * */
                test1(event) {
                    alert('宝贝，你来了~~');
                },
                test2(number,event) {
                    alert('我抄,'+number);
                }
            }
        });
    </script>
</body>
</html>